@charset "UTF-8";

.editormd .CodeMirror, #{$prefix}preview {
  display: inline-block;
  width: 50%;
  height: 100%;
  vertical-align: top;
  @include box-sizing(border-box);
  margin: 0;
}

#{$prefix}preview {
  position: absolute;
  top: 35px;
  right: 0;
  right: -1px \0
;
  overflow: auto;
  line-height: 1.6;
  display: none;
  background: #fff;
  z-index: 10;
}

.editormd {

  .CodeMirror {
    z-index: 10;
    float: left;
    border-right: 1px solid $borderColor;
    font-size: 14px;
    font-family: "YaHei Consolas Hybrid", Consolas, "微软雅黑", "Meiryo UI", "Malgun Gothic", "Segoe UI", "Trebuchet MS", Helvetica, "Monaco", courier, monospace;
    line-height: 1.6;
    margin-top: 35px;

    pre {
      font-size: 14px;
      padding: 0 12px;
    }
  }

  .CodeMirror-linenumbers {
    padding: 0 5px;
  }

  .CodeMirror-selected {
    background: #70B7FF;
  }

  .CodeMirror-focused .CodeMirror-selected {
    background: #70B7FF;
  }

  .CodeMirror, .CodeMirror-scroll, #{$prefix}preview {
    -webkit-overflow-scrolling: touch;
  }

  .styled-background {
    background-color: #ff7;
  }

  .CodeMirror-focused .cm-matchhighlight {
    background-image: url();
    background-position: bottom;
    background-repeat: repeat-x;
  }

  .CodeMirror-empty {
    //outline: 1px solid #c22;

    &.CodeMirror-focused {
      outline: none;
    }
  }

  .CodeMirror pre.CodeMirror-placeholder {
    color: #999;
  }

  .cm-trailingspace {
    background-image: url();
    background-position: bottom left;
    background-repeat: repeat-x;
  }

  .cm-tab {
    background: url();
    background-position: right;
    background-repeat: no-repeat;
  }
}
